<template>
	<section class="common_topbar">
		<div class="topbar">
			<i class="ic-arrow_right" v-show="flag" @click="$router.go(-1)"></i>
			<p>{{topname}}</p>

		</div>

	</section>

</template>

<script>
export default {
  name:'topbar',
	props:{
		topname:{
			type:String,
			default:'Z Plus'
		}
	},
  data(){
    return{
			flag:'true'

    }
  },
	methods:{
		topflag(){
			if(this.$route.path == '/'){
				this.flag = false;
			}else {
				this.flag = true;
			}
		}

	},
	watch:{
		'$route':'topflag'
	}
}

</script>

<style lang="scss" scoped>
.common_topbar{
	width: 100%;
	.topbar{
		width: 100%;
		height: 70px;

		display: flex;
		justify-content: center;
		align-items: center;
		background-color: black;
		.ic-arrow_right{
			position: absolute;
			left:30px;
			top: 20px;
			transform: rotateY(180deg);
			color: white;
		}
		p{
			color: white;
			font-size: 30px;

		}
		.topbarfont{
			color:white;
		}
		i{
      float: left;
    }
	}

}

</style>
